<template>
  <el-button type="primary" @click="addoctor" class="box-card1">
    通知填写
  </el-button>
  <el-card class="box-card">
    <el-table :data="types" stripe style="width: 100%" height="500">
      <el-table-column prop="id" label="公告序号" width="150" />
      <el-table-column prop="title" label="标题" width="150" />
      <el-table-column prop="content" label="内容" width="150" />
      <el-table-column prop="day" label="日期" width="150" />
      <el-table-column prop="img" label="选取的图" sortable width="150">
        <!--插入图片链接的代码-->
        <template #default="row">
          <el-image :src="row.row.img" style="width: 70px; height: 70px" />
        </template>
      </el-table-column>
    
      <el-table-column fixed="right" label="操作" width="250">
        <template #default="row">
          <el-button type="success" @click="handleDiaClick(row)">
            更多编辑
          </el-button>
          <!-- 删除确认框 -->
          <el-popconfirm title="确定要删除吗?" @confirm="deleks(row)">
            <template #reference>
              <el-button type="danger">删除</el-button>
            </template>
          </el-popconfirm>
        </template>
      </el-table-column>
    </el-table>
    <!-- 编辑 -->
    <el-dialog v-model="dialogVisible" title="编辑" width="30%" @close="shiqu">
      <el-form label-width="100px">
        <el-form-item label="公告序号" :data="types">
          <el-input v-model="Edit.id" />
        </el-form-item>
        <el-form-item label="标题" :data="types">
          <el-input v-model="Edit.title" />
        </el-form-item>
        <el-form-item label="内容" :data="types">
          <el-input v-model="Edit.content" />
        </el-form-item>
        <el-form-item label="日期" :data="types">
          <el-input v-model="Edit.day" />
        </el-form-item>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="quxiao()">取消</el-button>
          <el-button
            type="primary"
            @click="updatedoctor()"
            v-model="dialogVisible"
            >确认</el-button
          >
        </span>
      </template>
    </el-dialog>
    <!-- 添加医生 -->
    <el-dialog v-model="dialogVisible1" title="添加医生" width="30%">
      <el-form label-width="120px">
        <el-form-item label="公告序号">
          <el-input v-model="form.id" width="250" />
        </el-form-item>
        <el-form-item label="标题">
          <el-input v-model="form.title" />
        </el-form-item>
        <el-form-item label="内容">
          <el-input v-model="form.content" />
        </el-form-item>
        <el-form-item label="选取的图">
          <el-input v-model="form.img" />
        </el-form-item>
        <el-form-item label="日期">
          <el-input v-model="form.day" />
        </el-form-item>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="dialogVisible1 = false">取消</el-button>
          <el-button type="primary" @click="edit1()" v-model="dialogVisible1"
            >确认</el-button
          >
        </span>
      </template>
    </el-dialog>

    <!-- 分配账号 -->
    <el-dialog v-model="dialogVisible2" title="分配账号" width="30%">
      <el-form label-width="120px">
        <el-form-item label="用户名" :data="types">
          <el-input v-model="Edit.userName" />
        </el-form-item>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="dialogVisible2 = false">取消</el-button>
          <el-button type="primary" @click="fenpei()" v-model="dialogVisible2"
            >确认</el-button
          >
        </span>
      </template>
    </el-dialog>
  </el-card>
</template>

<script>
import { ElMessage } from 'element-plus'
import { get } from '@/utils/request'
export default {
  name: 'DrugIndex',
  data() {
    return {
      types: [],
      dialogVisible: false,
      dialogVisible1: false,
      dialogVisible2: false,
      Edit: [],
      form: [],
      value2: false,
      //二级联动
      options: [],
      selectedOptions: [],
      selectedOptions1: [],
      defaultParams: {
        label: 'departmentName',
        value: 'departmentId',
        children: 'children'
      }
    }
  },
  mounted() {
    get('/getAllNotices').then((res) => {
      this.types = res.data
      console.log(this.types)
    }),
      get('/getAllDepartments').then((res) => {
        this.options = res.data.data
        console.log(this.options)
      })
  },
  methods: {
    //分配账号
    allocation(row) {
      this.Edit = row.row
      this.selectedOptions1[0] = this.Edit.departId1
      this.selectedOptions1[1] = this.Edit.departId2
      console.log(this.Edit)
      console.log(this.selectedOptions1)
      this.dialogVisible2 = !this.dialogVisible2
    },
    shiqu() {
      window.location.reload()
    },
    quxiao() {
      this.dialogVisible = !this.dialogVisible
    },
    updatedoctor() {
      this.dialogVisible = !this.dialogVisible
      console.log(this.Edit)
      console.log(this.Edit)
      //修改医生
      get('/updateNotice', {
        id: this.Edit.id,
        title: this.Edit.title,
        content: this.Edit.content,
        img: this.Edit.img,
        day: this.Edit.day
      })
      ElMessage({
        message: '修改成功',
        type: 'success'
      })
    },
    //编辑医生
    handleDiaClick(row) {
      this.dialogVisible = !this.dialogVisible
      this.Edit = row.row
      this.selectedOptions1[0] = this.Edit.departId1
      this.selectedOptions1[1] = this.Edit.departId2
      console.log(this.Edit)
      console.log(this.selectedOptions)
    },
    handleChange(value) {
      this.Edit.departId1 = value[0]
      this.Edit.departId2 = value[1]
      console.log(value)
    },
    addoctor() {
      this.dialogVisible1 = !this.dialogVisible1
    },
    //添加医生
    edit1() {
      this.dialogVisible1 = !this.dialogVisible1
      get('/addNotice', {
        id: this.form.id,
        title: this.form.title,
        content: this.form.content,
        day: this.form.day,
        img: this.form.img
      })
      ElMessage({
        message: '添加成功',
        type: 'success'
      })
      window.location.reload()
      console.log(this.form)
    },
    edit() {
      this.dialogVisible = !this.dialogVisible
    },
    deleks(row) {
      console.log(row.row.docId)

      get('/deleteNotice', {
        docId: row.row.docId
      })
      ElMessage({
        message: '删除成功',
        type: 'success'
      })
      window.location.reload()
    },
    //分配账号
    fenpei() {
      this.dialogVisible2 = !this.dialogVisible2
      get('/registerUser', {
        userName: this.Edit.userName,
        telephone: this.Edit.telephone,
        realName: this.Edit.docName,
        password: 123456,
        userRole: 'doctor'
      }).then((row) => {
        console.log(row)
        if (row.data.code == 0) {
          get('/updateDoctors', {
            docId: this.Edit.docId,
            userName: this.Edit.userName,
            departId1: this.selectedOptions1[0],
            departId2: this.selectedOptions1[1]
          })
          ElMessage({
            message: '分配成功',
            type: 'success'
          })
        } else {
          ElMessage({
            message: '分配失败，已经账号',
            type: 'error'
          })
          window.location.reload()
        }
      })
    },
    tuijina(row){
      console.log(row.row.docId)
       get('/updateRecommend', {
        docId: row.row.docId,
        recommend: row.row.recommend,
      })
      ElMessage({
        message: '修改成功',
        type: 'success'
      })
    }
  }
}
</script>

<style scoped>
.box-card {
  margin-top: 5px;
  margin-left: 15px;
  margin-right: 15px;
}
.box-card1 {
  margin-top: 5px;
  margin-left: 15px;
}
</style>
